package com.grechur.wanandroidcompose.page

import android.util.Log
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.*
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.lifecycle.viewmodel.compose.viewModel
import androidx.navigation.NavHostController
import com.grechur.wanandroidcompose.bean.coin.CoinBean
import com.grechur.wanandroidcompose.bean.coin.CoinFromBean
import com.grechur.wanandroidcompose.ui.theme.Purple200
import com.grechur.wanandroidcompose.ui.theme.Purple700
import com.grechur.wanandroidcompose.viewmodel.CoinViewModel

@Composable
fun MineCoinPage(globalNavigation: NavHostController, coinViewModel: CoinViewModel) {
    val appBarHeight = 56.dp
    val statusBarDp = with(LocalDensity.current) {
        WindowInsets.statusBars.getTop(this).toDp()
    }
    LaunchedEffect(Unit) {
        coinViewModel.takeCoinList()
    }
    Log.e("zhouzhu", "coin:${coinViewModel.hashCode()}")
    Scaffold(topBar = {
        TopAppBar(
            title = {
                Text(text = "我的积分")
            },
            navigationIcon = {
                IconButton(onClick = { globalNavigation.popBackStack() }) {
                    Icon(imageVector = Icons.Default.ArrowBack, contentDescription = "back")
                }
            },
            actions = {
                IconButton(onClick = { globalNavigation.navigate("coinRanking") }) {
                    Icon(imageVector = Icons.Default.EmojiEvents, contentDescription = "rank")
                }
            },
            modifier = Modifier
                .background(
                    brush = Brush.linearGradient(
                        listOf(
                            Purple700,
                            Purple200
                        )
                    )
                )
                .height(appBarHeight + statusBarDp)
                .padding(top = statusBarDp),
            backgroundColor = Color.Transparent,
            elevation = 0.dp
        )
    }) {
        if (coinViewModel.takeCoins.isSuccess) {
            LazyColumn(modifier = Modifier.padding(it).navigationBarsPadding()) {
                item {
                    coinViewModel.mineCoinInfo?.let { coinBean ->
                        Column() {
                            Row(modifier = Modifier
                                .fillMaxWidth()
                                .background(Color(0.4f, 0.4f, 0.4f, 0.6f))
                                .padding(horizontal = 10.dp, vertical = 8.dp),
                                verticalAlignment = Alignment.CenterVertically
                            ) {
                                Text(text = "${coinBean.username}",
                                    color = Color.Cyan,
                                    fontSize = 20.sp,
                                    modifier = Modifier.padding(start = 10.dp))
                                Column(modifier = Modifier
                                    .weight(1f)
                                    .padding(horizontal = 10.dp)) {
                                    Text(text = "等级：${coinBean.level}",
                                        color = Color.Black,
                                        fontSize = 16.sp)
                                    Text(text = "金币：${coinBean.coinCount}",
                                        color = Color.Gray,
                                        fontSize = 14.sp,
                                        modifier = Modifier.padding(top = 10.dp))
                                }
                            }
                            Spacer(modifier = Modifier.fillMaxWidth().height(10.dp))
                        }
                    }

                }
                items(coinViewModel.takeCoins.getOrDefault(listOf())) { coinBean: CoinFromBean ->
                    Column {
                        Row(modifier = Modifier
                            .fillMaxWidth()
                            .height(50.dp), verticalAlignment = Alignment.CenterVertically) {
                            Text(text = "+${coinBean.coinCount}",
                                color = Color.Cyan,
                                fontSize = 20.sp,
                                modifier = Modifier.padding(start = 10.dp))
                            Column(modifier = Modifier
                                .weight(1f)
                                .padding(horizontal = 10.dp)) {
                                Text(text = "${coinBean.reason}",
                                    color = Color.Black,
                                    fontSize = 16.sp)
                                Text(text = "${coinBean.desc}",
                                    color = Color.Gray,
                                    fontSize = 14.sp,
                                    modifier = Modifier.padding(top = 10.dp))
                            }
                        }
                        Divider()
                    }

                }
            }
        }

    }
}